<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>个人信息页</title>
		<style type="text/css">
			body {
			    font-family: 'Helvetica Neue',Helvetica,sans-serif;
			    font-size: 17px;
			    line-height: 21px;
			    color: #000;
			    -webkit-overflow-scrolling: touch;
			}
			.header{
				display: block;
				background-color:#403F44;
				position: fixed;
				z-index: 10;
			    right: 0;
			    left: 0;
			    height: 44px;
			    padding-right: 10px;
   			    padding-left: 10px;
   			    top: 0px;
			}
			.header .h-h1{
				display: inline-block;
   			    width: auto;
   			    margin: 0;
				position: absolute;
    			right: 40px;
   			    left: 40px;
   			    color: #fff;
				font-size: 17px;
				font-weight: 500;
    			line-height: 44px;
   			    text-align: center;   
   			    white-space: nowrap;
   			    overflow: hidden;    
			}
			.header .h-button{
				display: inline-block;
				position: relative;	
   			    z-index: 20;
   			    top: 0;
   			    border: 0;
   			    padding: 0;
   			    cursor: pointer;
   			    float: left;
			}
			.content{
				margin-top: 10px;
				padding-top: 44px;
				font-size: 17px;
				font-weight: 500;
    			line-height: 40px;
    			color: #B1B1B1;
    			margin:10px 5px 0px 5px;
			}
			.content .content-row{
				position: relative;
				height: 40px;
			}
			.content .content-row .c-img{
				height: 80px;
				width: 30%;
				position: absolute;
				z-index: 100;
				top: 0px;
				right: 0px;
			}
			.content .content-row img{
				height: 100%;
				width: 100%;
			}
			.content .content-row input{
				margin-left: 20px;
				border: 0px;
			}
			.content .content-row .i-name{
				margin-left: 52px;
			}
			.content .content-row .i-sex{
				margin-left: 52px;
			}
			.content .content-row .i-id{
				margin-left: 37px;
			}
			.content .content-row .i-age{
				display: inline-block;
				padding: 0 3px!important;
				margin-left: 20px;
				width: 18%;
				height: 22px;
			    border: solid 1px #ccc!important;
				border-radius: 4px;
			}
			.content .content-row .i-address{
				margin-left: 53px;
				display: inline-block;
				padding: 0 3px!important;
				width: 18%;
				height: 22px;
			    border: solid 1px #ccc!important;
				border-radius: 4px;
			}
			.content .content-row .i-address1{
				margin-left: 20px;
				display: inline-block;
				padding: 0 3px!important;
				width: 18%;
				height: 22px;
			    border: solid 1px #ccc!important;
				border-radius: 4px;
			}
			.content .content-row .c-button{
				font-size: 18px;
				color: #fff;
				font-weight: 400;
  			    line-height: 1.42;
			    display: block;
			    width: 100%;
			    margin-top: 20px;
			    padding: 15px 0;
			    border: 1px solid #007aff;
   				background-color: #007aff;
   				border-radius: 3px;
			    border-top-left-radius: 3px;
			    border-top-right-radius: 3px;
			    border-bottom-right-radius: 3px;
			    border-bottom-left-radius: 3px;
			    background-clip: padding-box;
			}
		</style>
	</head>
	<body>
		<header class="header">
			<h1 class="h-h1">个人信息页</h1>
			<button class="h-button">
			</button>
		</header>
		<div class="content">
			<form>
				<div class="content-row">
					<label for="">姓名</label>
					<input type="text" class="i-name"/>
					<div class="c-img">
						<img src="images/timg.jpg" />
					</div>
				</div>
				<div class="content-row">
					<label for="">性别</label>
					<input type="radio" name="sex" checked="" class="i-sex"/>男 
					<input type="radio" name="sex"/>女
				</div>
				<div class="content-row">
					<label for="">身份证</label>
					<input type="text"   class="i-id"/>
				</div>
				<div class="content-row">
					<label for="">出生年月</label>
					<input type="text" class="i-age" /> 年
					<input type="text" class="i-age"/> 月
				</div>
				<div class="content-row">
					<label for="">地址</label>
					<input type="text"   class="i-address"/> 省
					<input type="text"   class="i-address1"/> 市
				</div>
				<div class="content-row">
					<label for="">详细地址</label>
					<input type="text"   class="i-detiel-address"/>
				</div>
				<div class="content-row">
					<label for="">联系电话</label>
					<input type="text"   class="i-phone"/>
				</div>
				<div class="content-row">
					<button class="c-button">完成修改</button>
				</div>
			</form>
		</div>
	</body>
</html>
